<?php
require('header.php');
$sql = "SELECT * FROM notes";
$r = mysql_query($sql) or die('Could not find any games in database.');
?>
    <h1>Notes</h1>
    <hr>
    <form class="well form-search" action="/weblinks-dev/index.php" method="post">
      <input type="text" class="span6 search-query" name="search"> 
      <button class="btn" type="submit">Search</button>
    </form>
    <hr>
    <a class="btn btn-success" href="add_note.php">
      <i class="icon-plus-sign icon-white"></i> Add new note
    </a>
    <hr>
    
    <div class="accordion-group span6">
      <?php
      $i=0;
      while($note=mysql_fetch_assoc($r)) {
        echo '<div class="accordion-heading">';
        echo '<a href="#collapse'.$i.'" data-parent="#accordion2" data-toggle="collapse" class="accordion-toggle">'.$note['title'].'</a></div>';
        echo '<div class="accordion-body collapse in" id="collapse'.$i.'">';
        echo '<div class="accordion-inner">';
        echo $note['note'];
        echo '</div></div>';        
        $i+=1;
      }
      ?>
    </div>
    <div class="well span4">
    <h3>Bookmarks</h3>
    </div>

  </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap-transition.js"></script>
    <script src="assets/js/bootstrap-alert.js"></script>
    <script src="assets/js/bootstrap-modal.js"></script>
    <script src="assets/js/bootstrap-dropdown.js"></script>
    <script src="assets/js/bootstrap-scrollspy.js"></script>
    <script src="assets/js/bootstrap-tab.js"></script>
    <script src="assets/js/bootstrap-tooltip.js"></script>
    <script src="assets/js/bootstrap-popover.js"></script>
    <script src="assets/js/bootstrap-button.js"></script>
    <script src="assets/js/bootstrap-collapse.js"></script>
    <script src="assets/js/bootstrap-carousel.js"></script>
    <script src="assets/js/bootstrap-typeahead.js"></script>
    <script>
    $(function () {
      $(".collapse").collapse()
    });

    </script>
  </body>
</html>
